import React from 'react';
import { Routes, Route } from 'react-router-dom';
import { Layout } from 'antd';
import AppHeader from './components/AppHeader';
import AppSider from './components/AppSider';
import Dashboard from './pages/Dashboard';
import Chat from './pages/Chat';
import DataSources from './pages/DataSources';
import DecisionRules from './pages/DecisionRules';
import './App.css';

const { Content } = Layout;

const App: React.FC = () => {
  return (
    <Layout className="app-container">
      <AppHeader />
      <Layout>
        <AppSider />
        <Layout className="main-layout">
          <Content className="main-content">
            <Routes>
              <Route path="/" element={<Dashboard />} />
              <Route path="/dashboard" element={<Dashboard />} />
              <Route path="/chat" element={<Chat />} />
              <Route path="/data-sources" element={<DataSources />} />
              <Route path="/decision-rules" element={<DecisionRules />} />
            </Routes>
          </Content>
        </Layout>
      </Layout>
    </Layout>
  );
};

export default App;
